import React from 'react'
import { createBehavior, createResource } from '@designable/core'
import { DnFC, useNodeIdProps } from '@designable/react'
import { AllSchemas } from '../../schemas'
import { AllLocales } from '../../locales'
import { AfterPurchaseFixedDuration as CustomAfterPurchaseFixedDuration } from '../../customComponents/AfterPurchaseFixedDuration'
import { createVoidFieldSchema } from '../Field'

export const AfterPurchaseFixedDuration: DnFC<
  React.ComponentProps<typeof CustomAfterPurchaseFixedDuration>
> = (props) => {
  const nodeIdProps = useNodeIdProps()
  return (
    <div {...nodeIdProps}>
      <CustomAfterPurchaseFixedDuration {...props} />
    </div>
  )
}

AfterPurchaseFixedDuration.Behavior = createBehavior({
  name: 'AfterPurchaseFixedDuration',
  extends: ['Field'],
  selector: (node) =>
    node.props['x-component'] === 'AfterPurchaseFixedDuration',
  designerProps: {
    propsSchema: createVoidFieldSchema(AllSchemas.AfterPurchaseFixedDuration),
  },
  designerLocales: AllLocales.AfterPurchaseFixedDuration,
})

AfterPurchaseFixedDuration.Resource = createResource({
  icon: 'FixedValidity',
  elements: [
    {
      componentName: 'Field',
      props: {
        type: 'object',
        title: 'AfterPurchaseFixedDuration',
        'x-component': 'AfterPurchaseFixedDuration',
        'x-component-props': {
          namePost: 'post',
          middleText: '天后生效，有效期',
          nameCount: 'count',
          nameUnit: 'unit',
          addonTextBefore: '自购买之后',
        },
      },
    },
  ],
})
